<script setup>
import {onMounted, ref} from "vue";
import {get, post} from "../../util/request.js";
import {showToast} from "vant";
import {useStore} from "../../pinia/index.js";
import {useRouter} from "vue-router";

const store = useStore();
const address = ref({});
const currentCourse = ref({})
const materials = ref({})
const router = useRouter();
const loading = ref(true);
const finished = ref(false);
const onClickLeft = () => history.back();
const order = ref({courseId:'',
addressId:'',
totalAmount:''})

onMounted(() => {
  currentCourse.value = store.currentCourse;
  materials.value=store.material;
  order.value.courseId = currentCourse.value.courseId;
  order.value.totalAmount = currentCourse.value.price
  get("address/getDefaultAddress").then(res => {

    if (res.code == 0) {
      if(res.data==null){
        showToast("尚未设置默认地址")
      }else{
        console.log(res.data)
        order.value.addressId = res.data.addressId;
        address.value = {
          id: res.data.addressId,
          userId: res.data.userId,
          name: res.data.name,
          tel: res.data.phoneNumber,
          province: res.data.province,
          city: res.data.city,
          county: res.data.district,
          addressDetail: res.data.detailAddress,
          isDefault: res.data.isDefault
        };
      }


    } else {

      if (res.msg=="请求操作失败") {
        if (res.data == "用户未登录") {
          router.push("/login")
        }
      }
        showToast("您尚未登录")
    }
  })

  // get("/material/courseRefmaterial",{courseId:currentCourse.value.id}).then(res=>{
  //   if(res.code==0){
  //     materials.value=res.data;
  //
  //     store.setMaterial(materials)
  //     console.log(materials)
  //   }else{
  //
  //   }
  // })

})

const onLoad = () =>{
  loading.value = false;
}
const submitOrder = () => {

  post("order/createOrder",order.value).then(res=>{
    if(res.code==0){
      showToast("创建订单成功")
    }else {
      showToast("创建订单失败")
    }
  })



    console.log("materials")
  console.log(materials)
  console.log("materials.end")
}

const toAddressList= ()=>{
  router.push("/addressList");
}

</script>

<template>
  <van-nav-bar
      title="确认订单"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
  />

  <van-button @click="toAddressList">修改收货地址 </van-button>
  <br>

  <p> 教材将邮寄到此:{{ address.province }}{{ address.city }}{{ address.county }}{{ address.addressDetail }}</p>


  <van-divider>课程信息</van-divider>
  <h3>{{ currentCourse.title }}</h3>
  <p>${{ currentCourse.price }}</p>

  <p>{{ currentCourse.startDate }}</p>--<p>{{ currentCourse.endDate }}</p>

  <p>赠送</p>
  <router-link to="">上课教材</router-link>


  <van-list
      @load="onLoad"
  >
    <div v-for="item in materials">
      {{item.title}}
    </div>
    <van-cell v-for="item in materials" :key="item" :title="item" />
  </van-list>




  <van-list
      v-model:loading="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
  >
    <div v-for="material in materials">
      <h3>{{materials.title}}</h3>
      <van-image
          width="10rem"
          height="10rem"
          fit="cover"
          position="left"
          :src="material.imageUrl"
      />
      <h6> {{material.description}}</h6>
    </div>

    <!--    <van-cell v-for="material in materials" :key="material" :title="material" >-->
    <!--      {{material.title}}  <br>-->
    <!--      {{material.description}}-->
    <!--&lt;!&ndash;      <img :src="material.imageUrl">&ndash;&gt;-->
    <!--    </van-cell>-->
  </van-list>
  <p>上课教材一旦签收,退课时将直接扣除工本资</p>




  <van-submit-bar :price="currentCourse.price*100" button-text="提交订单" @submit="submitOrder" />
</template>


<style scoped>
.goods-card {
  margin: 0;
  display: flex;
}

.delete-button {
  height: 100%;
}
</style>